

/* 0.网站统一样式 */

/* 设置网站字体的基准大小 */
html {
  font-size: 62.5%;
}

/* 统一网站的字体基本颜色 */
body {
  color: #333;

}

/* 去掉下划线 */
a {
  text-decoration: none;
  color: #333;
}

/* 图片依据父容器等比例缩放 */
img {
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

/* 取消标题和列表默认的盒子定义 */
h1,
h2,
h3,
h4,
h5,
h6,
ul,
figure,
p {
margin: 0;
padding: 0;
font-weight: normal;
}
/* 取消项目符号 */
li {
  list-style-type: none;
}

header,
nav,
main,
footer {
  width: 80%;
  margin: 0 auto;
}
/* 页面定宽容器 */
.w1200 {
width: 958px;
margin: 0 auto;
}
/* 页面顶部 */
/* 页面定宽容器 */
.w1200 {
width: 120rem;
margin: 0 auto;
}

/* 顶部外边距30px */
.mt30 {
margin-top: 3rem;
}

/* 顶部外边距20px */
.mt20 {
margin-top: 2rem;
}

/* 顶部外边距10px */
.mt10 {
margin-top: 1rem;
}

/* 左浮动 */
.fl{
float: left;
}

/* 右浮动 */
.fr{
float: right;
}
/* 1.页面头部 */
header {
  color: #0e0d0d;
  background: #fdfbfb;
}
.top-top{
  width: 958px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  /* 将normalize.css中line-height:1.15层叠，覆盖掉，用来解决header和navbar之间的距离 */
  line-height: 0;
}
/* 1.1 头部导航 */
 .top-nav {
  width: 958px;
  height: 20px;
  display: flex;
  /* justify-content: space-around; */
  align-items: center;
  margin: 0 auto;
  /* 将normalize.css中line-height:1.15层叠，覆盖掉，用来解决header和navbar之间的距离 */
  line-height: 0;
}
.logo{
  width: 958px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  /* 将normalize.css中line-height:1.15层叠，覆盖掉，用来解决header和navbar之间的距离 */
  line-height: 0;
}
 
.top-nav .push-right {
  display: flex;
  margin-left: auto;
}

.top-nav a {
  color: hsl(0, 3%, 6%);
  padding-right: 1rem;
}

/* 伪元素实现 “｜”的显示 */
.top-nav a:not(:last-of-type)::after {
  content: "|";
  margin-left: 1rem;
  display: inline-block;
}

h1 {
  height: 10rem;
}
.logo>h1{
  height: 135px;
}


/* 2.页面导航 */

/* 2.1 主菜单 */
.nav{
width: 958px;
height: 4rem;
display: flex;
justify-content: space-around;
align-items: center;
background-color: #ebebeb;
margin: 0 auto;
/* 将normalize.css中line-height:1.15层叠，覆盖掉，用来解决header和navbar之间的距离 */
line-height: 0;
}
nav>li{
display: flex;
width: 100%;
}
nav a {
display: block; /*从行级元素转换为块级元素*/
/* margin:  0 auto; */
/* margin-left: 20px; */
text-align: center; /*水平居中*/
/* width: 100%; */
height: 4rem;
/* height: 20px; */
/* height: 16px; */
line-height: 4rem; /*在单行下与高度一起实现垂直居中*/
border-right: 1px solid black;
}

/* nav {
background-color: #ebebeb;
} */

nav ul {
display: flex;
align-items: center;
justify-content: space-around;
}

nav li {
flex: 1;
}

nav li > a {
font-size: 1.6rem;
}
/* 菜单“首页”的默认颜色设置 */
nav>ul>li>a:hover {
color: red;
border-right: 1px solid black;
/* background: #c4420a; */
}
/* 2.2 二级菜单 */
nav ul.sub-menu {
display: none;
position: absolute; /* 脱离正常文档流，按照父容器定位*/
}

nav li:hover ul.sub-menu {
display: flex;
flex-direction: column;
align-items: stretch;
background-color: #c4420a;
width: calc(120rem / 9);
/* border-right: 1px solid black; */
/* width: 60px; */
}

nav ul.sub-menu a {
color: #fff;
font-size: 12px;
}

nav ul.sub-menu li:hover > a {
background-color: #c4430c;
}

/* 3.页面主体 */
.message{
width: 958px;
height: 220px;
display: flex;
justify-content: space-around;
/* align-items: center; */
margin: 0 auto;
margin-top: 5px;
}
.message-swiper{
width: 324px;
height: 220px;
}

.message-swiper>ul{
width: 100%;
}
/* 将所有display设置为none */
.message-swiper>ul:nth-child(1)>li{
width: 100%;
display: none;
}

.message-swiper>ul:nth-child(1)>li>a>img{
width: 324px;
height: 220px;
}
/* 单独给li中含有classname=.message-active中display设置为flew使其图片显示出来 */
.message-swiper>ul:nth-child(1)>.message-active{
display: flex;
}
.message-swiper>ul:nth-child(2){
width: 150px;
height: 22px;
display: flex;
flex-wrap: wrap;
position: absolute;
margin-top: -30px;
margin-left: 160px;
}
.message-swiper>ul:nth-child(2)>li{
width: 16.6%;
}
.message-swiper>ul:nth-child(2)>li>span{
width: 22px;
height: 22px;
/* border: 1px solid black; */
color: white;
background-color: rgb(1,1, 1,0.3);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.message-swiper>ul:nth-child(2)>li>.message-idx-active{
background-color: orange;
}
.message-news{
width: 347px;
height: 220px;
border:1px solid grey;
/* border-right:1px solid grey; */

}
.message-news>ul>li:nth-child(1){
display: flex;
/* width: 100%; */
height: 30px;
align-items: center;
background-image: url(../images/newPic1.gif);
background-repeat: no-repeat;
}
.message-news2>ul>li:nth-child(1){

background-image: url(../images/indexLpic1.gif);
}
.message-news3>ul>li:nth-child(1){

background-image: url(../images/indexMpic4.gif);
}
.message-news4>ul>li:nth-child(1){

background-image: url(../images/tzPic2.gif);
}



.message-news>ul>li:nth-child(1)>div:nth-child(2){
display: flex;
/* width: 100px; */
margin-left: 40px;
color: white;
}
.message-news2>ul>li:nth-child(1)>div:nth-child(2){
margin-left: 50px;
color: blue;
}
.message-news4>ul>li:nth-child(1)>div:nth-child(2){
margin-left: 5px;
}
.message-news>ul>li:nth-child(1)>div:nth-child(3)>a{
margin-left: 180px;
color: orange;
}


.message-news4>ul>li:nth-child(1)>div:nth-child(3)>a{
margin-left: 140px;

}
.message-news3>ul>li:nth-child(1)>div:nth-child(3)>a{
margin-left: 200px;
color: black;
}
.message-news>ul>li:nth-child(1)>div:nth-child(3)>a:hover{
color: black;
}
.message-news a{
font-size: 8px;
color: black;
}
.message-news a:hover{
color: red;
}
.message-news span{
font-size: 8px;
}
.message-news>ul>li:nth-child(2){
display: flex;
/* justify-content: space-around; */
align-items: center;
}
.message-news>ul>li:nth-child(2)>ul>li{
display: flex;
/* justify-content: space-around; */
align-items: center;
}
.message-news4>ul>li:nth-child(2)>ul>li{
margin-bottom: 8px;
}
.message-news>ul>li:nth-child(2)>ul>li>div:nth-child(1){
display: flex;
justify-content: space-around;
align-items: center;
margin-left: 12px;
}
.message-news>ul>li:nth-child(2)>ul>li>div:nth-child(1)>span{
align-self: center;
color: red;
}
.message-news4>ul>li:nth-child(2)>ul>li>img{
width: 267px;
margin-top: 20px;
}
.message-news>ul>li:nth-child(2)>ul>li>div:nth-child(2){
width: 300px;
margin-left: 12px;
}
.message-news2>ul>li:nth-child(2)>ul>li>div:nth-child(2){
width: 280px;
margin-left: 12px;
}




.message-notice{
width: 267.4px;
height: 220px;
border-left:1px solid grey;
border-right:1px solid grey;

}
.message-notice>ul>li:nth-child(1){
display: flex;
/* width: 100%; */
height: 30px;
align-items: center;
background-image: url(../images/tzPic2.gif);
background-repeat: no-repeat;
}
.message-notice>ul>li:nth-child(1)>div:nth-child(2){
display: flex;
/* width: 100px; */
margin-left: 10px;
color: white;
}
.message-notice>ul>li:nth-child(1)>div:nth-child(3)>a{
margin-left: 150px;
color: orange;
}
.message-notice>ul>li:nth-child(1)>div:nth-child(3)>a:hover{
color: black;
}
.message-notice a{
font-size: 8px;
color: black;
}
.message-notice a:hover{
color: red;
}
.message-notice span{
font-size: 8px;
}
.message-notice>ul>li:nth-child(2){
display: flex;
align-items: center;
}
.message-notice>ul>li:nth-child(2)>ul>li{
display: flex;
align-items: center;
margin-top: 2px;
}
.message-notice>ul>li:nth-child(2)>ul>li>div:nth-child(1){
display: flex;
justify-content: space-around;
align-items: center;
margin-left: 12px;
}
.message-notice>ul>li:nth-child(2)>ul>li>div:nth-child(1)>span{
align-self: center;
color: red;
}
.message-notice>ul>li:nth-child(2)>ul>li>div:nth-child(2){
width: 267.4px;
margin-left: 12px;
}
.message-notice>ul>li:nth-child(1){
width: 267.4px;
height: 30px;
}
.message-notice>ul>li:nth-child(2){
width: 267.4px;
height: 190px;

position: relative;
overflow: hidden;
}
.slideshow{
display: flex;
/* width: 954px;
height: 100%; */
justify-content: space-around;
flex-direction: column;
white-space: nowrap;
  animation: slide 2s linear infinite;

}
.slideshow>li{
margin-bottom: 20px;
}

@keyframes slide {
0% { transform: translateY(0%); }
100% { transform: translateY(-50%); }
}
.message2{
width: 958px;
height: 233px;
display: flex;
justify-content: space-around;
/* align-items: center; */
margin: 0 auto;
margin-top: 5px;
}
.message3{
width: 958px;
height: 252.6px;
display: flex;
justify-content: space-around;
/* align-items: center; */
margin: 0 auto;
margin-top: 5px;
}
.w267{
width: 267px;
}
.w352{
width: 352px;
}
.w329{
width: 329px;
}
.w335{
width: 335px;
}
.w345{
width: 345px;
}
.w268{
width: 268px;
}
.work{
display: flex;
width: 335px;
height: 220;
flex-wrap: wrap;
justify-content: space-around;
/* flex-direction: column; */
}
.work>li{
display: flex;
width: 159px;
height: 47px;
margin-top: 5px;
}
.work>li>img{
width: 100%;
height: 100%;
}
.hf{
display: flex;
width: 268px;
height: 220px;
flex-wrap: wrap;
justify-content: space-around;
}
.hf>li{
display: flex;
width: 125px;
height: 24px;
margin-top: 5px;
}
.hf>li>div{
margin-right: 5px;
}

footer {
width: 962px;
height: 60px;
background: url(../images/footerbg.gif)  center
  center;
color: black;
font-size: 1.4rem;
padding-top: 1rem;

}
footer>p{
text-align: center;
}
address{
margin-top: 10px;
  text-align: center;
}
